import React from 'react';
import { Layout, Typography, Card } from 'antd';
const { Title, Text, Paragraph } = Typography;
const { Content } = Layout;


const TypographyPage: React.FC = () => {
  return (
    <Content>
      <Card>
        <Title level={2}>排版</Title>
        <Text code>antd/lib/typography</Text>
        <div style={{ marginTop: 20 }}>
          <div>
            <h2>排版</h2>
            <Title level={1}>一级标题</Title>
            <Title level={2}>二级标题</Title>
            <Title level={3}>三级标题</Title>
            <Title level={4}>四级标题</Title>
            <Title level={5}>五级标题</Title>

            <Text>普通文本</Text>
            <Text code>代码文本</Text>
            <Text mark>标记文本</Text>


            <Paragraph>
              这是一个段落示例。Ant Design 提供了多种排版组件，可以满足大部分文本展示需求。
              <Text code>Typography</Text> 组件支持多种样式和类型，包括标题、文本、段落等。
            </Paragraph>
          </div>
        </div>
      </Card>
    </Content>
  );
};

export default TypographyPage;